<!DOCTYPE html>
<head>
    #parse('base/head.html')
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="$!webPath/assets/kartik/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link href="$!webPath/assets/kartik/themes/explorer/theme.css" media="all" rel="stylesheet" type="text/css"/>
    <script src="$!webPath/assets/kartik/js/plugins/sortable.js" type="text/javascript"></script>
    <script src="$!webPath/assets/kartik/js/fileinput.js" type="text/javascript"></script>
    <script src="$!webPath/assets/kartik/js/locales/fr.js" type="text/javascript"></script>
    <script src="$!webPath/assets/kartik/js/locales/zh.js" type="text/javascript"></script>
    <script src="$!webPath/assets/kartik/themes/explorer/theme.js" type="text/javascript"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>

</head>
<body class="no-skin">
<form style="margin-top: 20px" class="form-horizontal" role="form" method="post" action="$!webPath/xxgl/add">
    <input value="$!sysInfoPO.infoId" type="text" style="display: none" id="infoId">
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right" for="form-title"> 标题 </label>
        <div class="col-sm-9">
            <input value="$!sysInfoPO.title" type="text" id="form-title" placeholder="标题" class="col-xs-10 col-sm-5">
            <span style="color: red">*</span>
        </div>
    </div>
    <div class="form-group ">
        <label class="col-sm-2 control-label no-padding-right" for="form-expDate"> 过期时间 </label>
        <div style="z-index: 9999" class="col-sm-8">
            <input value="$!dateTool.format('yyyy-MM-dd',$!sysInfoPO.expDate)" class="form-control date-picker"
                   id="form-expDate" type="text" data-date-format="yyyy-mm-dd">
        </div>
    </div>
    <div style="display: none" class="form-group case" style="z-index: -1">
        <label class="col-sm-2 control-label no-padding-right" for="form-expDate"> banner </label>
        <div class="col-sm-9">
            <input id="file-banner" name="file" type="file">
        </div>
    </div>
    <div style="display: none" class="form-group case" style="z-index: -1">
        <label class="col-sm-2 control-label no-padding-right" for="form-expDate"> 分享人 </label>
        <div class="col-sm-9">
            <input id="info_name" value="$!sysInfoPO.infoName" name="text" type="text" >
        </div>
    </div>
    <div class="form-group" style="z-index: -1">
        <label class="col-sm-2 control-label no-padding-right" for="form-expDate"> 附件 </label>
        <div class="col-sm-9">
            <input id="file-fr" name="file-fr[]" type="file" multiple>
        </div>
    </div>
    <div class="form-group" style="z-index: -1">
        <label class="col-sm-2 control-label no-padding-right" for="editor"> 内容 </label>
        <div class="col-sm-9" >
            <script id="editor" type="text/plain" style="width:100%;z-index:-1"></script>
        </div>
    </div>
    <div class="clearfix form-actions">
        <div class="col-md-offset-3 col-md-9">
            <button id="submitFormBtn" class="btn btn-info" type="button">
                <i class="ace-icon fa fa-check bigger-110"></i>
                保存
            </button>
            <button onclick="toList()" class="btn" type="reset">
                <i class="ace-icon fa fa-undo bigger-110"></i>
                返回
            </button>
        </div>
    </div>
</form>
<div style="display: none">
    <input type="hidden" id="contentValue" value="$!sysInfoPO.content">
</div>
</body>
<script type="text/javascript" charset="utf-8" src="$webPath/xxgl/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="$webPath/xxgl/ueditor.all.min.js"></script>
<script src="$!webPath/assets/js/bootstrap-datepicker.min.js"></script>
<script>
    var fileMap =  new Map()
    var bannerUrl = ''
    var ue = UE.getEditor('editor');
    ue.addListener('ready', function (editor) {
        UE.getEditor('editor').execCommand('insertHtml', $("#contentValue").val())
    });
    $(function ($) {
        $('.date-picker').datepicker({
            autoclose: true,
            todayHighlight: true
        })
        //show datepicker when clicking on the icon
                .next().on(ace.click_event, function () {
            $(this).prev().focus();
        });
        $("#submitFormBtn").on('click', function () {
            console.info(fileMap)
            var fileArray = []
            fileMap.forEach(function(val,key,value){
                fileArray.push(val);
            })
            var atttchUrls = fileArray.join(",")
            if($("#form-title").val()==''){
                alert("标题不能为空")
                return
            }
            if(UE.getEditor('editor').getPlainTxt().trim()==''){
                alert("内容不能为空")
                return
            }
            $.ajax({
                type: "POST",
                dataType: "Json",
                url: "$!webPath/xxgl/add",
                data: {
                    infoId: $("#infoId").val(),
                    title: $("#form-title").val(),
                    content: UE.getEditor('editor').getPlainTxt(),
                    infoType: '$!infoType',
                    expDate: $("#form-expDate").val(),
                    atttchUrls:atttchUrls,
                    banner: bannerUrl,
                    infoName: $("#info_name").val()

                },
                success: function (result) {
                    parent.frames[0].location.href = "$!webPath/xxgl/fpzcList?infoType=$!infoType"
                },
                error: function (data) {
                    alert(22);
                }
            });
        })
        $('#file-fr').on('fileuploaded', function (event, data, previewId, index) {
            fileMap.set(previewId,data.response.rspData[0].imgUrl)
            console.log(data.response.rspData[0].imgUrl);
        });
        $('#file-fr').on('filesuccessremove', function(event, key, jqXHR, data) {
            fileMap.delete(key)
        });
        $('#file-banner').on('fileuploaded', function (event, data, previewId, index) {
            bannerUrl = data.response.rspData[0].imgUrl
        });
        $('#file-banner').on('filesuccessremove', function(event, key, jqXHR, data) {
            bannerUrl = ""
        });
    })
    function toList() {
        parent.frames[0].location.href = "$!webPath/xxgl/fpzcList?infoType=$!infoType"
    }
    $('#file-fr').fileinput({
        uploadUrl: '$!webPath/xxgl/upload',
        language: 'zh',
        hideThumbnailContent: true,
        showCaption: false
    });
    $('#file-banner').fileinput({
        uploadUrl: '$!webPath/xxgl/upload',
        allowedFileExtensions: ['jpg', 'png'],
        language: 'zh',
        showCaption: true
    });
    if('$!infoType'=='2'){
        $(".case").show();
    }
</script>
</html>